<div class="well well-sm">
  <h4>{{ vm.platformSvc.getI18nString(vm.Strings.View.Settings.Permissions.Title) }}</h4>
  <div class="panel-content">
    <div class="animate-fade-in">
      <div class="form-group setting-group">
        <label>{{ vm.platformSvc.getI18nString(vm.Strings.View.Settings.Permissions.Read.Title) }}</label>
        <div class="setting-value status-icon">
          <div class="success animate-fade-in" ng-show="vm.readWebsiteDataPermissionsGranted"
               title="{{ vm.platformSvc.getI18nString(vm.Strings.View.Settings.Permissions.Granted) }}">
            <icon type="'check'" bold="true"></icon>
          </div>
          <div class="danger animate-fade-in" ng-show="!vm.readWebsiteDataPermissionsGranted"
               title="{{ vm.platformSvc.getI18nString(vm.Strings.View.Settings.Permissions.NotGranted) }}">
            <icon type="'x'" bold="true"></icon>
          </div>
        </div>
        <p class="description"
           ng-bind-html="vm.platformSvc.getI18nString(vm.Strings.View.Settings.Permissions.Read.Description)">
        </p>
        <div class="buttons animate-fade-in" ng-show="vm.readWebsiteDataPermissionsGranted">
          <button class="btn btn-default" ng-click="vm.utilitySvc.handleEvent(vm.revokePermissions)">
            {{ vm.platformSvc.getI18nString(vm.Strings.View.Settings.Permissions.Remove) }}
          </button>
        </div>
        <div class="buttons animate-fade-in" ng-hide="vm.readWebsiteDataPermissionsGranted">
          <button class="btn btn-default" ng-click="vm.utilitySvc.handleEvent(vm.requestPermissions)">
            {{ vm.platformSvc.getI18nString(vm.Strings.View.Settings.Permissions.Add) }}
          </button>
        </div>
      </div>
    </div>
  </div>
</div>
